<template>
  <div class="email-dia" style="height: 350px;overflow: auto;">


    <el-form
      class="dia-form"
      ref="elForm"
      :model="formData"
      :rules="rules"
      size="small"
      label-width="127px"
       style="margin-left:0px;padding: 24px 24px 24px 24px;"

    >
      <div v-show="islink == 0">
        <el-col :span="24">
          <div class="tips" name="jichu">基础属性</div>
        </el-col>

        <el-col :span="12">
          <el-form-item label="规则名称" prop="field101">
            <el-input
              v-model="formData.field101"
              placeholder="规则名称"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>


       <el-col :span="12">
          <el-form-item label="优先级" prop="field114">
             <el-select v-model="formData.field114" placeholder="请选择优先级" clearable :style="{width: '100%'}">
                      <el-option v-for="(item, index) in field114Options" :key="index" :label="item.label"
                        :value="item.value" :disabled="item.disabled"></el-option>
                    </el-select>

          </el-form-item>
        </el-col>

        <el-col :span="24">
        <el-form-item label="规则说明" prop="field117">
          <el-input v-model="formData.field117" type="textarea" placeholder="请输入备注"
            :autosize="{minRows: 3, maxRows: 3}" :style="{width: '100%'}"></el-input>
        </el-form-item> </el-col>

        </div>



 <div v-show="islink == 0">
        <el-col :span="24">
          <div class="tips" name="jichu">规则指标</div>
        </el-col>
       <el-col :span="24" style="margin-bottom: 18px">
         <span class="el-icon-help" style="color: #2979ff" @click="AddClick"
           >添加属性规则：</span
         >
       </el-col>
       <el-col :span="24">
         <el-table
           :data="tableData"
           style="width: 100%"
           border
           :header-cell-style="{ background: '#F3F5FC' }"
         >
           <el-table-column prop="name" label="实体对象" width="240">
             <template slot-scope="scope">
               <el-select v-model="scope.row.name" placeholder="请选择" clearable :style="{width: '100%'}">
                           <el-option v-for="(item, index) in field102Options" :key="index" :label="item.label"
                             :value="item.value" :disabled="item.disabled"></el-option>
                </el-select>

               </el-form-item>
             </template>
           </el-table-column>
           <el-table-column prop="code" label="关联" width="240">
             <template slot-scope="scope">
               <el-select v-model="scope.row.rel" placeholder="请选择" clearable :style="{width: '100%'}">
                           <el-option v-for="(item, index) in field115Options" :key="index" :label="item.label"
                             :value="item.value" :disabled="item.disabled"></el-option>
                </el-select>
             </template>
              </el-table-column>
             <el-table-column prop="value" label="对象值" width="240">
               <template slot-scope="scope">
                 <el-input v-model="scope.row.value"></el-input>
               </template>
             </el-table-column>

           <el-table-column prop="operate" label="操作">
             <template slot-scope="scope">
               <span
                 style="color: blue"
                 v-if="scope.row.operate == ''"
                 @click.stop="MoveClick"
                 >删 除</span
               >
               <span v-else>{{ scope.row.operate }}</span>
             </template>
           </el-table-column>
         </el-table>
       </el-col>

       <el-col :span="24" style="margin-bottom: 18px">
         <span class="el-icon-help" style="color: #2979ff" @click="AddDoClick"
           >添加行为规则：</span
         >
       </el-col>
       <el-col :span="24">
         <el-table
           :data="tableDoData"
           style="width: 100%"
           border
           :header-cell-style="{ background: '#F3F5FC' }"
         >

           <el-table-column prop="name" label="时间" width="240">
             <template slot-scope="scope">
               <el-select v-model="scope.row.time" placeholder="请选择" clearable :style="{width: '100%'}">
                           <el-option v-for="(item, index) in field106Options" :key="index" :label="item.label"
                             :value="item.value" :disabled="item.disabled"></el-option>
                </el-select>

             </template>
           </el-table-column>
           <el-table-column prop="code" label="行为" width="240">
             <template slot-scope="scope">
               <el-select v-model="scope.row.action" placeholder="请选择" clearable :style="{width: '100%'}">
                           <el-option v-for="(item, index) in field107Options" :key="index" :label="item.label"
                             :value="item.value" :disabled="item.disabled"></el-option>
                </el-select>
             </template>
              </el-table-column>
             <el-table-column prop="value" label="动作" width="240">
               <template slot-scope="scope">
                 <el-select v-model="scope.row.do" placeholder="请选择" clearable :style="{width: '100%'}">
                             <el-option v-for="(item, index) in field108Options" :key="index" :label="item.label"
                               :value="item.value" :disabled="item.disabled"></el-option>
                  </el-select>
               </template>
             </el-table-column>

           <el-table-column prop="operate" label="操作">
             <template slot-scope="scope">
               <span
                 style="color: blue"
                 v-if="scope.row.operate == ''"
                 @click.stop="MoveDoClick"
                 >删 除</span
               >
               <span v-else>{{ scope.row.operate }}</span>
             </template>
           </el-table-column>
         </el-table>
       </el-col>




   </div>




    </el-form>
  </div>
</template>
<script>
export default {
  components: {},
  props: [],
  data() {
    return {
      islink: 0,
      radio: 2,
      formData: {

      }, /**业务属性start**/
      tableData: [

      ],
      tableDoData: [

      ],
field114Options: [{
                        "label": "1",
                        "value": 1
                      },{
                        "label": "2",
                        "value": 2
                      },{
                        "label": "3",
                        "value": 3
                      },{
                        "label": "4",
                        "value": 4
                      },{
                        "label": "5",
                        "value": 5
                      },{
                        "label": "6",
                        "value": 6
                      },{
                        "label": "7",
                        "value": 7
                      },{
                        "label": "8",
                        "value": 8
                      },{
                        "label": "9",
                        "value": 9
                      },{
                        "label": "10",
                        "value": 10
                      }],
          field102Options: [{
             "label": "主机编号",
             "value": 1
           }, {
             "label": "主机IP",
             "value": 2
           }, {
             "label": "主机名称",
             "value": 3
           }, {
             "label": "主机类型",
             "value": 4
           },
           {
             "label": "主机MAC",
             "value": 5
           },
            {
             "label": "备注状态类型",
             "value": 6
           },
            {
             "label": "部门名称",
             "value": 7
           },
            {
             "label": "责任人",
             "value": 8
           },
            {
             "label": "责任人编号",
             "value": 9
           },
           {
             "label": "国产化类型",
             "value": 10
           },
            {
             "label": "资产编号",
             "value": 11
           },
            {
             "label": "部门编号",
             "value": 12
           },
            {
             "label": "唯一标识",
             "value": 13
           },
            {
             "label": "访问权限标号",
             "value": 14
           }],
           field115Options: [{
                  "label": "等于",
                  "value": 1
           },{
                  "label": "包含在",
                  "value": 2
           },{
                  "label": "不包含在",
                  "value": 3
           },{
                  "label": "包含在关联资源表",
                  "value": 4
           },{
                  "label": "不包含在关联资源表",
                  "value": 5
           },{
                  "label": "等于关联资源表",
                  "value": 6
           }
           ],
           field106Options: [{
                 "label": "近一小时",
                 "value": 0
               },{
                 "label": "近一天",
                 "value": 1
               },{
                 "label": "近一周",
                 "value": 2
               },{
                 "label": "近一月",
                 "value": 3
               },{
                 "label": "自定义",
                 "value": 4
               }],

          field108Options: [{
                  "label": "应用软件登出行为",
                  "value": 1
                }, {
                  "label": "应用软件登录行为",
                  "value": 2
                }, {
                  "label": "异常操作行为",
                  "value": 3
                }, {
                  "label": "网络传输文件行为",
                  "value": 4
                }, {
                  "label": "硬件操作行为",
                  "value": 5
                }, {
                  "label": "操作系统登出行为",
                  "value": 6
                }, {
                  "label": "认证登录行为",
                  "value": 7
                }, {
                  "label": "运维操作行为",
                  "value": 8
                }, {
                  "label": "网络访问行为",
                  "value": 9
                }, {
                  "label": "操作系统登录行为",
                  "value": 10
                }, {
                  "label": "配置策略变更操作行为",
                  "value": 11
                }, {
                  "label": "心跳行为",
                  "value": 12
                }, {
                  "label": "应用操作行为",
                  "value": 13
                }, {
                  "label": "软件操作行为",
                  "value": 14
                }, {
                  "label": "本地操作文件行为",
                  "value": 15
                }, {
                  "label": "介质传输文件行为",
                  "value": 16
                }],
          field107Options: [{
                        "label": "执行",
                        "value": 1
                      },{
                        "label": "未执行",
                        "value": 2
                      }],
                field109Options: [{
                  "label": "库存中",
                  "value": 1
                }, {
                  "label": "待入网",
                  "value": 2
                }, {
                  "label": "已入网",
                  "value": ""
                }, {
                  "label": "维修中",
                  "value": ""
                }, {
                  "label": "退网中",
                  "value": ""
                }, {
                  "label": "已退网",
                  "value": ""
                }, {
                  "label": "报废中",
                  "value": ""
                }, {
                  "label": "已报废",
                  "value": ""
                }],
  field110Options: [{
        "label": "Windows",
        "value": 1
      }, {
        "label": "国产专用",
        "value": 2
      }, {
        "label": "普通国产",
        "value": 3
      }, {
        "label": "未知",
        "value": 4
      }],
  field111Options: [{
        "label": "分类",
        "value": 1
      }, {
        "label": "活跃度",
        "value": 2
      },
      {
        "label": "密级",
        "value": 3
      },
      {
        "label": "攻击",
        "value": 4
      },
      {
        "label": "风险项",
        "value": 5
      },
      {
        "label": "风险等级",
        "value": 6
      },
      {
        "label": "状态",
        "value": 7
      },
      {
        "label": "主题",
        "value": 8
      },
       {
        "label": "配置合规",
        "value": 9
      },
       {
        "label": "异常行为",
        "value": 10
      },
       {
        "label": "属性",
        "value": 11
      },
       {
        "label": "用途",
        "value": 12
      },
       {
        "label": "备案",
        "value": 13
      },
       {
        "label": "其他",
        "value": 14
      }],

 field112Options: [{
        "label": "宝兰德",
        "value": ""
      }, {
        "label": "瀚高",
        "value": 1
      }, {
        "label": "锐捷",
        "value": ""
      }, {
        "label": "华为",
        "value": ""
      }],
 field113Options: [{
        "label": "无类型",
        "value": 1
      }, {
        "label": "探测扫描",
        "value": 2
      },{
        "label": "渗透攻击",
        "value": 3
      }, {
        "label": "入侵检测",
        "value": 4
      },{
        "label": "安转工具",
        "value": 5
      }, {
        "label": "恶意行为",
        "value": 6
      }],
field122Options: [{
        "label": "机密",
        "value": 1
      }, {
        "label": "秘密",
        "value": ""
      }, {
        "label": "内部",
        "value": ""
      }, {
        "label": "公开",
        "value": ""
      }, {
        "label": "绝密",
        "value": ""
      }],
    field123Options: [{
              "label": "一般",
              "value": 1
            }, {
              "label": "重要",
              "value": 2
            }, {
              "label": "非常重要",
              "value": 3
            }],
      field124Options: [{
        "label": "运维单位1",
        "value": 1
      }, {
        "label": "运维单位2",
        "value": ""
      }],
      field127Options: [{
        "label": "运维终端",
        "value": 1
      }, {
        "label": "办公终端",
        "value": 2
      }, {
        "label": "未知",
        "value": 3
      }],

      rules: {
        field110: [
          {
            required: true,
            message: '请输入单行文本',
            trigger: 'blur'
          }
        ],
        field101: [
          {
            required: true,
            message: '请输入',
            trigger: 'blur'
          }
        ],
        field102: [{
                 required: true,
                 message: '请选择是否国产化',
                 trigger: 'change'
        }],
        field103: [
          {
            required: true,
            message: '请输入发送邮件地址',
            trigger: 'blur'
          }
        ],
        field105: [
          {
            required: true,
            message: '请输入发送邮件端口',
            trigger: 'blur'
          }
        ],
        field107: [
          {
            required: true,
            message: '请输入，多个用英文;隔开',
            trigger: 'blur'
          }
        ],
        field108: [
          {
            required: true,
            message: '请输入，多个用英文;隔开',
            trigger: 'blur'
          }
        ],
        field109: [
          {
            required: true,
            message: '请输入，多个用英文;隔开',
            trigger: 'blur'
          }
        ],
        field111: [
          {
            required: true,
            message: '请输入在用状态',
            trigger: 'blur',
            }
          ],
        field112: [
          {
            required: true,
            message: '请输入，多个用英文;隔开标题',
            trigger: 'blur'
          }
        ],
        field113: [
          {
            required: true,
            message: '请输入正文',
            trigger: 'blur'
          }
        ]
      }
    }
  },
  computed: {},
  watch: {},
  created() {
  },
  mounted() {
  },

  methods: {
    AddClick() {

    const arr = {
      name: "",
      code: "",
      operate: "",
    };
    this.tableData.push(arr);
  },
  AddDoClick() {

    const arr = {
      name: "",
      code: "",
      operate: "",
    };
    this.tableDoData.push(arr);
  },
  MoveDoClick() {
    this.tableDoData.pop();
  },
  MoveClick() {
    this.tableData.pop();
  }


  }
}
</script>
<style scoped lang="scss">
.email-dia {
  display: flex;
  height: 540px;
  width: 100%;
  justify-content: space-between;
  max-height: 100vh;

  aside {
    padding: 0;
    width: 140px !important;
    position: absolute;
    height: 540px;
    background: #fff;
    border-right: 1px solid #e8e8e8;

    .option-group {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;

      li {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 15px 0 15px 24px;
        cursor: pointer;
        font-size: 14px;
        color: #303032;
        font-weight: 400;

        &.activeLink {
          border-right: 2px solid #2979ff;
          background: #dfecff;
          color: #2979ff;
        }
      }
    }
  }

  .dia-form {
    margin-left: 140px;
    padding: 24px 80px 24px 24px;
    width: 100%;
  }
}
</style>
